<template>
  <gui-page class="gui-bg-white">
    <template v-slot:gBody>
      <view class="gui-bg-white gui-dark-bg-level-3 gui-padding">
        <view
          style="padding: 15rpx; align-items: normal !important"
          class="gui-list-items gui-border-b"
          @tap="goDetail(item)"
          v-for="(item, index) in dataList"
        >
          <view style="padding-top: 40rpx">
            <image
              @tap.stop.prevent="goCard(item.authorId)"
              style="width: 100rpx; height: 100rpx; border-radius: 100rpx"
              class="gui-list-image"
              mode="aspectFill"
              :src="item.avatarUrl"
            ></image>
          </view>
          <view class="gui-list-body" style="margin-left: 20rpx">
            <view class="gui-list-title">
              <text class="gui-list-title-text gui-primary-text">{{
                item.authorName
              }}</text>
            </view>
            <text class="gui-list-body-desc gui-color-gray xhs-margin-top-5"
              >{{
                item.type == 1 ? "评论了你的笔记" : "回复了你的评论"
              }}
              &nbsp;{{ formatDate(item.createTime) }}</text
            >

            <view class="gui-list-title xhs-margin-top-5">
              <text class="gui-list-title-text gui-primary-text">{{
                item.replayContent
              }}</text>
            </view>

            <view
              class="gui-list-body-desc gui-color-gray xhs-margin-top-10 gui-ellipsis"
              style="
                border-left: 5rpx solid rgba(181, 179, 188, 0.39);
                padding-left: 6rpx;
              "
              >{{ item.parentReplayContent }}</view
            >

            <!--<view-->
            <!--  class="gui-flex gui-margin-top gui-justify-content-start"-->
            <!--  v-show="item.type == 2"-->
            <!--&gt;-->
            <!--  <view-->
            <!--    class="gui-button-mini xhs-border-radius50 gui-border xhs-margin-right-10"-->
            <!--    style="-->
            <!--      text-align: center;-->
            <!--      width: 120rpx;-->
            <!--      background: rgba(236, 233, 233, 0.39);-->
            <!--      border: none !important;-->
            <!--    "-->
            <!--  >-->
            <!--    <text class="gui-icons">&#xe6ad; 赞</text>-->
            <!--  </view>-->

            <!--  <view-->
            <!--    class="gui-button-mini xhs-border-radius50"-->
            <!--    style="-->
            <!--      text-align: center;-->
            <!--      width: 120rpx;-->
            <!--      background: rgba(236, 233, 233, 0.39);-->
            <!--      border: none !important;-->
            <!--    "-->
            <!--  >-->
            <!--    <text class="gui-icons">&#xe6b8; 留言</text>-->
            <!--  </view>-->
            <!--</view>-->
          </view>
          <view style="padding-top: 35rpx">
            <image
              class="gui-border-radius"
              style="width: 80rpx; height: 75rpx; margin-top: 20rpx"
              :src="item.firstPicture"
              mode="aspectFill"
            ></image>
          </view>
        </view>

        <gui-empty v-show="dataList.length == 0" style="height: 600rpx">
          <template v-slot:img>
            <view class="gui-flex gui-rows gui-justify-content-center">
              <text
                class="gui-icons gui-empty-icon gui-color-gray"
                style="font-size: 80rpx"
                >&#xe6b8;
              </text>
            </view>
          </template>
          <template v-slot:text>
            <text
              class="gui-block gui-text-center xhs-margin-top-30 gui-color-gray"
              >暂无消息，多发消息可以收获赞和收藏~</text
            >
          </template>
        </gui-empty>

        <gui-loadmore
          v-show="dataList.length > 0"
          :loadMoreText="[
            '上划加载更多',
            '更多数据加载中',
            '已加载全部数据',
            '暂无数据',
          ]"
          ref="loadmorecom1"
          :status="1"
        ></gui-loadmore>
      </view>
    </template>
  </gui-page>
</template>
<script>
import commonMixin from "@/mixin/commonMinxin";
import filterUrl from "@/hooks/filterUrl";

export default {
  mixins: [commonMixin],
  data() {
    return {
      dataList: [],
      page: 1,
      userId: "",
      accessToken: "",
      queryParams: {},
    };
  },
  onLoad(e) {
    console.log(e);
    this.queryParams = e;
    this.accessToken = e.accessToken;
    this.userId = e.userId;
    this.$nextTick(() => {
      this.getReplayMes();
    });
  },
  onReachBottom: function () {
    console.log("到底了");
    var status = this.$refs["loadmorecom1"].loadMoreStatus;
    if (status == 2) return;
    this.getReplayMes();
  },
  onPullDownRefresh: function () {
    console.log("下拉刷新了");
    this.page = 1;
    this.getReplayMes(1);
  },
  methods: {
    goCard(authorId) {
      let url = filterUrl(
        "/pages/card/card",
        { authorId: authorId, userId: this.userId },
        this.queryParams,
      );
      if (authorId == this.userId) {
        console.log(
          `https://www.yaozhuasocial.com/yaozhua_shequ/#/pages/my/my?authorId=${authorId}&userId=${this.userId}&token=${uni.getStorageSync(
            "token",
          )}`,
        );
        switch (uni.getSystemInfoSync().platform) {
          case "android":
            let d = JSON.stringify({
              hideNavBar: "1",
              hideTotalNavBar: "0",
              hideBottomSafeBar: "0",
              url: `https://www.yaozhuasocial.com/yaozhua_shequ/#/pages/my/my?authorId=${authorId}&userId=${this.userId}&token=${uni.getStorageSync(
                "token",
              )}`,
            });
            window.AndroidBridge.myHomepage(d);
            break;
          case "ios":
            window.webkit.messageHandlers.myHomepage.postMessage({
              hideNavBar: "1",
              hideTotalNavBar: "0",
              hideBottomSafeBar: "0",
              url: `https://www.yaozhuasocial.com/yaozhua_shequ/#/pages/my/my?authorId=${authorId}&userId=${this.userId}&token=${uni.getStorageSync(
                "token",
              )}`,
            });
            break;
          default:
            console.log("运行在开发者工具上");
            break;
        }
      } else {
        console.log(url);
        switch (uni.getSystemInfoSync().platform) {
          case "android":
            let d = JSON.stringify({
              hideNavBar: "1",
              hideTotalNavBar: "0",
              hideBottomSafeBar: "0",
              url: url,
            });
            window.AndroidBridge.pushNewWebVC(d);
            break;
          case "ios":
            window.webkit.messageHandlers.pushNewWebVC.postMessage({
              hideNavBar: "1",
              hideTotalNavBar: "0",
              hideBottomSafeBar: "0",
              url: url,
            });
            break;
          default:
            console.log("运行在开发者工具上");
            break;
        }
      }
    },
    //格式化时间
    formatDate(date) {
      return uni.app.formatDate(date);
    },
    //进入详情
    goDetail(e) {
      console.log(e.type);
      let detail = "";
      if (e.noteType == 1) {
        detail = "detail";
      } else if (e.noteType == 2) {
        detail = "videoDetail";
      }
      let url = filterUrl(
        `pages/notes/${detail}/${detail}`,
        {
          noteId: e.noteId,
          domId: e.replyId,
        },
        this.queryParams,
      );
      console.log(url);
      switch (uni.getSystemInfoSync().platform) {
        case "android":
          let d = JSON.stringify({
            hideNavBar: "1",
            hideTotalNavBar: "0",
            hideBottomSafeBar: "0",
            url: url,
          });
          window.AndroidBridge.pushNewWebVC(d);
          console.log("运行Android上");
          break;
        case "ios":
          window.webkit.messageHandlers.pushNewWebVC.postMessage({
            hideNavBar: "1",
            hideTotalNavBar: "0",
            hideBottomSafeBar: "0",
            url: url,
          });
          break;
        default:
          console.log("运行在开发者工具上");
          break;
      }
    },
    getReplayMes(isReload) {
      uni.app.post(
        "/blog/note/getReplayMes",
        { limit: 10, offset: this.page, authorId: this.userId },
        "",
        "",
        (res) => {
          console.log(res.data);
          if (this.page <= res.data.pages) {
            let records = res.data.records || [];
            // 处理数据，添加缺失的字段
            records = records.map((item) => {
              return {
                ...item,
                authorId: item.authorId || "", // 如果没有authorId，设置为空字符串
                avatarUrl: item.avatarUrl || "/static/my/pet.png", // 如果没有头像，使用默认头像
                authorName: item.authorName || "匿名用户", // 如果没有用户名，使用默认名称
                firstPicture: item.firstPicture || "/static/image/ds.png", // 如果没有图片，使用默认图片
              };
            });

            if (this.page == 1) {
              this.dataList = records;
            } else {
              this.dataList = [...this.dataList, ...records];
            }
            if (this.page == res.data.pages) {
              //停止加载更多
              this.$refs.loadmorecom1.nomore();
            } else {
              this.page++;
              this.$refs.loadmorecom1.stoploadmore();
            }
          } else if (res.data.pages == 0) {
            this.$refs.loadmorecom1.nomore();
          }
        },
      );
      if (isReload) {
        uni.stopPullDownRefresh();
      }
    },
  },
};
</script>
<style scoped></style>
